<template>
	<view>
		
		<cu-custom bgImage="https://image.weilanwl.com/color2.0/plugin/sylb2244.jpg" >
			<block slot="content">个人中心</block>
			
		</cu-custom>
		<view class="cu-list menu-avatar no-padding">
			<view class="cu-item" >
				<view class="cu-form-group">
			
			</view>
				<view class="cu-avatar round lg" :style="[{'background-image':'url('+headimgurl+')'}]"></view>
				<view class="content">
					<view class="text-black">{{nickname}}</view>
					<view class="text-gray text-sm " style="color:#ED1C24;font-weight: bold;left:95%;position: absolute;">
						{{openid}}
					</view>
				</view>
				
			</view>
		</view>
		<view class="cu-bar bg-white solid-bottom margin-top">
			<view class="action">
				<text class="cuIcon-title text-orange "></text> 我的订单
			</view>
			<view class="action" @tap="orderauth">
				查看全部 >
			</view>
		</view>
		
		
		<view class="cu-list grid" :class="['col-' + gridCol,gridBorder?'':'no-border']">
			<view @click="onGridClick(item.id)" class="cu-item" v-for="(item,index) in cuIconList" :key="index" v-if="index<gridCol*2">
				<view :class="['cuIcon-' + item.cuIcon,'text-' + item.color]">
					<view class="cu-tag badge" v-if="item.badge!=0">
						<block v-if="item.badge!=1">{{item.badge>99?'99+':item.badge}}</block>
					</view>
				</view>
				<text>{{item.name}}</text>
			</view>
		</view>
		<view class="cu-bar bg-white solid-bottom margin-top">
			<view class="action">
				<text class="cuIcon-title text-orange "></text> 精选推荐
			</view>
		</view>
		
		<view   class="cu-list menu-avatar">
			<block v-for="(item,index) in authlist" :key="index">
			<view class="cu-item">
				
				<view class="cu-avatar radius lg" :style="[{'background-image':'url('+item.urlimage+')'}]"></view>
				<view class="content">
					<view class="text-grey">{{item.authname}}</view>
					<view class="text-gray text-sm flex">
						<view class="text-gray text-sm flex">
							<text class="text-cut"></text>
							{{item.authdesc}}
						</view> </view>
				</view>
				<view class="action">
					<view class="text-grey text-xs">已售{{item.autzs}}</view>
					<view class="cu-tag round bg-red sm">{{item.price}}¥</view>
				</view>
			</view>
			
		   </block>
		</view>
		
	</view>
</template>

<script>
	var _self = null
	export default {
		
		data() {
			return {
				nickname:'默认名字',
				headimgurl:'https://ossweb-img.qq.com/images/lol/web201310/skin/big10001.jpg',
				openid:'',
				cuIconList: [
				// 	{
				// 	cuIcon: 'cardboardfill',
				// 	color: 'red',
				// 	badge: 120,
				// 	name: '待付款'
				// }
				// , {
				// 	cuIcon: 'recordfill',
				// 	color: 'orange',
				// 	badge: 1,
				// 	name: '待分享'
				// }
				{
					cuIcon: 'picfill',
					color: 'yellow',
					badge: 0,
					name: '已授权',
					id:'picfill'
				},
				{
					cuIcon: 'roundclosefill',
					color: 'red',
					badge: 0,
					name: '注销',
					id: 'roundclosefill'
				},
				// {
				// 	cuIcon: 'noticefill',
				// 	color: 'olive',
				// 	badge: 0,
				// 	name: '通知',
				// 	id:'noticefill'
				// }, {
				// 	cuIcon: 'upstagefill',
				// 	color: 'cyan',
				// 	badge: 0,
				// 	name: '排行榜',
				// 	id:'upstagefill'
				// }, {
				// 	cuIcon: 'clothesfill',
				// 	color: 'blue',
				// 	badge: 0,
				// 	name: '待评价',
				// 	id:'clothesfill'
				// }
				// , 
				// {
				// 	cuIcon: 'discoverfill',
				// 	color: 'purple',
				// 	badge: 0,
				// 	name: '发现'
				// }, 
				// {
				// 	cuIcon: 'questionfill',
				// 	color: 'mauve',
				// 	badge: 0,
				// 	name: '帮助'
				// }
				// , {
				// 	cuIcon: 'commandfill',
				// 	color: 'purple',
				// 	badge: 0,
				// 	name: '问答'
				// }, {
				// 	cuIcon: 'brandfill',
				// 	color: 'mauve',
				// 	badge: 0,
				// 	name: '版权'
				// },
				],
				gridCol: 3,
				gridBorder: false,
				authlist:[]
			}
		},
		onLoad(){
			_self=this;
			
			
			uni.request({
				url: this.$constant.BASEURL + this.$constant.GET_AUTHLIST,
				method: "POST",
				data:{  
					rec:'1',
				    username:getApp().globalData.username,
				    token:getApp().globalData.token,},
				header: {
					'content-type': 'application/x-www-form-urlencoded'
				},
				complete: (res) => {
					//console.log(JSON.stringify( res.data))
					if (res.data.code == 0) {
					  this.authlist=res.data.data;
					}else{
						
								uni.showToast({
									title: res.data.message,
									icon: 'none',
								})
								setTimeout(function(){
									uni.reLaunch({
										url:'/pages/login/login'
									})
								},1000)
							
						}
						
				}
			});
		
			uni.getStorage({
				key: 'openid',
				success: function(res) {
					 _self.nickname=res.data.nickname;
					 _self.headimgurl=res.data.headimgurl;
					 _self.openid=res.data.openid;
					 
				},
				fail: function(res) {
					 console.log('fill = ', res);
					
				}
			});
			
			
			
			
			
		},
		methods: {
			orderauth(){
				uni.navigateTo({
					url:'../auth/delivered'
				})
				
				
			},
			onGridClick(id) {
				// console.log(id)
				switch (id) {
					case 'picfill':
						uni.navigateTo({
							url: '../auth/delivered'
						})
						break;
					case 'roundclosefill':
						uni.clearStorage();
						//关闭当前网页  顺序不能颠倒 同时兼容ios和android
						// document.addEventListener('WeixinJSBridgeReady', function() {
						// 	WeixinJSBridge.call('closeWindow');
						// }, false);
						// WeixinJSBridge.call('closeWindow');
						
						// 拦截路由，并且跳转去其他页面
						new Promise(function(resolve, reject){
							uni.showToast({
								title: '清除缓存成功！',
								icon: 'none'
							})
							setTimeout(function(){
								resolve('/pages/login/login'); //代码正常执行！
							}, 1000);
						}).then(function(url){
							uni.reLaunch({
								url: url
							})
						});;
						
						break
					
					default:
						uni.showToast({
							title: '敬请期待',
							icon: 'none'
						})
						break;
				}
			}
			
		}
	}
</script>

<style>

</style>
